<template>
    <div class='app' v-loading="loading">
        <div class='ceng '>
          
           <div class='titles2' >
               <div style='text-align:right;margin-right:15px;margin-bottom:15px'>
                   
                    <div class='user' >
                        
                    
                        <i class='fa fa-user-o' style='font-size:16px;color:#fff;'></i>
                        &nbsp;
                        <el-dropdown>
                            <span class="el-dropdown-link" style='font-size:16px;cursor:pointer;'>
                                {{username}}
                            </span>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item icon="el-icon-lock" @click.native="updatePwd()">修改密码</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-user" @click.native="logout()">退出登陆</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-user" @click.native="freshs()">刷新</el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                    
                    
                    </div>
               </div>
               <img src='../assets/logo.png' style='display:none'/> {{title}}<img src='../assets/img/icon/head1.png'  style='width:120px;margin-top:-30px;margin-left:20px' >
           </div>
            <div :class="{'content':true,'content_1':data.length<5}">
                <div class='content_bottom'></div>
                <div class='item ' v-for="(item,index) in data" :key="index">
                    <div class='flex-column item_warp'  @click="openWin(item)">
                        <div :class='item.classItem'>
                           <i :class="item.fa" v-if="item.fa"></i>
                           <img :src="item.icon" v-else-if="item.icon" style='width:100%'/>
                        </div>
                        <div class='itemx'>
                            {{item.text}}
                        </div>
                    </div>
                </div>
                
                
            </div>
           
        </div>
        <el-dialog
            title="修改密码"
            :visible.sync="dialogVisible"
            width="30%"
            >
            
            <el-form ref="form"  label-width="80px">
                <el-form-item label="旧密码">
                    <el-input v-model="oldPwd" show-password></el-input>
                </el-form-item>
            </el-form>
             <el-form ref="form"  label-width="80px">
                <el-form-item label="新密码">
                    <el-input v-model="newPwd" show-password></el-input>
                </el-form-item>
            </el-form>
             <el-form ref="form"  label-width="80px">
                <el-form-item label="确认密码">
                    <el-input v-model="newPwd2" show-password></el-input>
                </el-form-item>
            </el-form>
             <el-alert
                title="密码中必须包含字母（不区分大小写）、数字，至少8个字符，最多30个字符"
                type="error"
                show-icon>
            </el-alert>
            
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="updatePwdHt">确 定</el-button>
            </span>
            </el-dialog>
    </div>
    
</template>
<script>
import Vue  from 'vue'
export default {
    data(){
        return {
            loading:true,
            title:'',
            modelId:'',
            data:[],
            titles:'',
            modelIds:'',
            oldPwd:'',
            newPwd:'',
            newPwd2:'',
            filenames:"",
            dialogVisible:false,
            isApp:"N",
            username:localStorage.getItem("username")
        }
    }, 
    created(){
      this.title=this.$route.query.title;
     // console.log(this.$route.query.titles);
    
     if(!this.$route.query.title){
         this.title=localStorage.getItem("company");
     }
     if(this.$route.query.isApp){
         this.isApp=this.$route.query.isApp;
     }
     if(this.$route.query.filenames){
         this.filenames=this.$route.query.filenames;
     }
      document.title=this.title;
     
    document.documentElement.style.fontSize = document.documentElement.clientWidth*20/320 + 'px';  
    
      this.loadData();
        
    },
    watch:{
        modelId(val){
            this.loadData();
        }
    },
    methods:{
        freshs(){
            location.reload()
        },
        loadData(){
            this.loading=true;
            if(!this.modelId){
                /*this.data=[{
                        text:'殡仪馆业务管理系统',
                        fa:'fa fa-university',
                        modelId:'1',
                        classItem:'img item1'
                    },
                    {
                        text:'公墓管理系统',
                        fa:'fa fa-inbox',
                        modelId:'363',
                        classItem:'img item4'
                    },
                    {
                        text:'OA办公',
                        fa:'fa fa-television',
                        modelId:'299',
                        classItem:'img item2',
                        id:'299'
                    },
                    {
                        text:'权限管理',
                        fa:'fa fa-users',
                        modelId:'31',
                        classItem:'img item3',
                        id:'31',
                        isModel:'Y'
                    }]*/
                    this.modelId="-1";
            } 
            let sef=this;
            let imgIp=localStorage.getItem("imgIp") 
            /**获取桌面模块，目前定义所有的模块显示，没有设置自主模块 */
            
            this.$post('api','api/model/getUserModelsByJson',{filename:this.filenames,isApp:this.isApp,isYtj:sessionStorage.getItem("isYtj")}).then(res=>{
            
                let nav=JSON.parse(unescape(res[0].nav));
                console.log(nav);
                sef.data=[];
                for(let i=0;i<nav.length;i++){
                    let index=i+1;
                    if(index>6){
                            index=index%6;
                    }
                        
                    let n=nav[i];
                    n.icon=imgIp+n.icon;
                    n.classItem="img item"+index;

                   

                    sef.data.push(n);
                    this.loading=false;
                  
                }
            });
        },
        openWin(item){
            console.log(item);
            let url="";
            if(item.url.indexOf("http")==-1&&item.isBlank!='Y'){
                if(item.url=="main"){
                    this.titles=this.titles+","+item.text;
                    this.modelIds=this.modelIds+","+item.id;
                
                    url="/main";
                }else if(item.url.indexOf("tabMain")!=-1){
                    this.titles=this.titles+","+item.text;
                    this.modelIds=this.modelIds+","+item.id;
                    let filename=item.filename;
                    let key=item.key;
                    url= "/byg/tabMain?title="+item.text+"&filename="+filename+"&isDesktop="+item.isDesktop+"&isMain=Y"
                }else if(item.url.indexOf("list")!=-1){
                
                    let key=item.key;
                    url=item.url.indexOf("?")==-1 ? item.url+"?key="+key+"&appid="+item.appid+"&isApp=Y"+"&model="+item.model+"&dbModelkey="+item.dbModelkey:item.url+"&key="+key+"&appid="+item.appid+"&isApp=Y"+"&model="+item.model+"&dbModelkey="+item.dbModelkey;
                }else if(item.url!=''){
                    this.titles=this.titles+","+item.text;
                    this.modelIds=this.modelIds+","+item.id;
                    let filename=item.filename;
                    //alert(item.url);
                   url=item.url.indexOf("?")==-1 ? item.url+"?title="+item.text+"&filename="+filename:item.url+"&title="+item.text+"&filename="+filename;
                }else{
                    let titles=this.titles+","+item.text;
                    this.modelIds=this.modelIds+","+item.id;
                    let filename=item.filename;
                    let key=item.key;
                    url= "/byg/tabMain?title="+item.text+"&filename="+filename+"&isDesktop="+item.isDesktop+"&isMain=Y"
                }
                console.log("url===================="+url);
                if(url.indexOf("main?")!=-1){
                    this.title=item.text;
                
                }else{

                    this.$router.push({path:url});
                }
            }else{
                window.open(item.url, "_blank");
            }
             
            
        },
        returns(){
            
           let titles=this.titles.split(",")
           this.title=titles[0];
           this.modelId="-1";
           
        },
        logout(){
            this.$router.push({path:"/login?sCode="+localStorage.getItem("sCode")+"&isApp="+this.isApp+"&filenames="+this.filenames+"&logout=Y&isYtj="+sessionStorage.getItem("isYtj")});
            sessionStorage.setItem("token","");
            localStorage.setItem("username","");
            localStorage.setItem("userId","");
        },
        updatePwd(){
            this.oldPwd="";
            this.newPwd2="";
            this.newPwd="";
            this.dialogVisible=true;

        },
        updatePwdHt(){
            let isOk=true;
            if(this.newPwd==''){
                isOk=false;
                this.$alert("密码不能为空", '提示', {
                    confirmButtonText: '确定',
                    callback: action => {
                        
                    }
                });
            }
            if(this.newPwd!=this.newPwd2&&isOk){
                isOk=false;
                this.$alert("两次密码不一致，请检查", '提示', {
                    confirmButtonText: '确定',
                    callback: action => {
                        
                    }
                });
            }
            var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z]).{8,30}')
            if (!pwdRegex.test(this.newPwd)&&isOk) {
                isOk=false;
                this.$alert("密码必须包含字母和数字，并且要大于8位数", '提示', {
                    confirmButtonText: '确定',
                    callback: action => {
                        
                    }
                });
            }
            if(isOk){
                 this.$post("api","api/login/updatePwd",{oldPwd:this.oldPwd,newPwd:this.newPwd}).then(data=>{
                     this.$alert(data[0].msg, '提示', {
                        confirmButtonText: '确定',
                        callback: action => {
                            if(data[0].status=="+OK"){
                                this.dialogVisible=false;
                            }
                        }
                    });
                     
                })
            }
        }
    }
}
</script>

<style scoped  src="../assets/css/main.css">
</style>